import { computed, ref,onMounted } from 'vue'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
import en from 'element-plus/dist/locale/en.mjs'
import { useI18n } from 'vue-i18n';  
export default function () {
    const { locale } = useI18n();  
    const language = ref(localStorage.getItem("language")=='English'?'English':'中文')
    const font=ref(localStorage.getItem("font")?localStorage.getItem("font"):'youyuan, sans-serif')
    computed(() => (language.value === '中文' ? zhCn : en))

    onMounted(()=>{
        modifyFont(font.value)
    })

    const toggle = () => {
        language.value = language.value === '中文' ? 'English' : '中文'
        locale.value= language.value==='English'? 'en': 'cn'

        localStorage.setItem("language",language.value);
    }

    const modifyFont = (key:string) =>{
        localStorage.setItem("font",key);
        document.body.style.fontFamily = key;  
    }
    return {font,language,toggle,modifyFont}

}